<template>
  <el-popover
    placement="bottom"
    :title="label"
    width="200"
    v-model="visible">
    <el-button type="text" size="mini" slot="reference">{{ label }}</el-button>
    <div>
      <div>
        <el-input
          v-model="filename"
          size="medium"
          :placeholder="type === 'folder' ? '请输入文件夹名称' : '请输入文件名称'"/>
      </div>
      <div style="margin-top: 10px;">
        <el-button @click="submit" type="primary" size="small">确认</el-button>
      </div>
    </div>
  </el-popover>
</template>

<script>
export default {
  name: 'myPopover',
  props: {
    label: String,
    type: String
  },
  data() {
    return {
      visible: false,
      filename: ''
    }
  },
  methods: {
    submit() {
      this.$emit('submit', {
        filename: this.filename,
        type: this.type
      })
      this.filename = ''
      this.visible = false
    }
  },
}
</script>

<style lang="scss">
.el-button {
  margin-left: 10px;
}
</style>